<template>
	<view class="">
		<uni-nav-bar v-if="!navType" :fixed="fixed" statusBar :backgroundColor="backgroundC" :left-icon="leftIcon" :right-icon="rightIcon" :border="border" :title="title" @clickLeft="clickLeft" @clickRight="clickRight">
			<block slot="right">
				<view class="rightNav" v-if="rightIcon">
					<uni-icons type="notification" size="24" @click="clickRight"></uni-icons>
					<text class="font10 redDot dot" v-if="noReadNum>0">{{noReadNum>99?'99+':noReadNum}}</text>
				</view>
			</block>
		</uni-nav-bar>
		<uni-nav-bar v-if="navType==2" :fixed="fixed" statusBar :backgroundColor="backgroundC" :left-icon="leftIcon" :right-icon="rightIcon" :border="border" :title="title" @clickLeft="clickLeft" @clickRight="clickRight">
			<view class="navTab font16 flex alignCenter">
				<view :class="defaultTab==index?'bold activeNavTab':''" v-for="(item,index) in navTabArr" :key="index" @click.stop="navTabClick(item)">{{item.title}}</view>
			</view>
		</uni-nav-bar>
	</view>
</template>

<script>
	import { messAllUnreadNum } from "@/api/mine.js"
	import { navigateLoginPage } from "@/utils/common.js"
	export default {
		name:"uni-mdnav",
		props:{
			navType:{
				type:[String,Number],
				default:''
			},
			// tab 点击事项，只有type=2时才是点击事项
			navTabArr:{
				type:Array,
				default(){
					return []
				}
			},
			// tab 点击事项默认选中哪个
			defaultTab:{
				type:[String,Number],
				default:0
			},
			fixed:{
				type:Boolean,
				default:true
			},
			leftIcon:{
				type:String,
				default:'left'
			},
			title:{
				type:String,
				default:'首页'
			},
			rightIcon:{
				type:String,
				default:''
			},
			border:{
				type:Boolean,
				default:false
			},
			backgroundC:{
				type:String,
				default:'#ffffff'
			},
			rightUrl:{
				type:String,
				default:'/pages/message/message'
			},
			isFresh:{
				type:Boolean,
				default:false
			}
		},
		watch:{
			isFresh(newVal,oldVal){
				console.error("监听数据",newVal,oldVal)
			}
		},
		data() {
			return {
				noReadNum:0
			};
		},
		created() {
			// if(!uni.getStorageSync('token') || !this.rightIcon) return
			// console.error('信息',!uni.getStorageSync('token'),!this.rightIcon,!uni.getStorageSync('token') || !this.rightIcon)
			this.getQuesNum()	
		},
		methods:{
			reFresh(){
				// if(!uni.getStorageSync('token') || !this.rightIcon) return
				this.getQuesNum()
			},
			// 获取所有消息未读数量
			getQuesNum(){
				if(!uni.getStorageSync('token') || !this.rightIcon) return
				console.error('信息',uni.getStorageSync('token'),!this.rightIcon)
				messAllUnreadNum().then((res)=>{
					if(res.code==100000){
						this.noReadNum=Number(res.data.qaMessageUnReadTotal)+Number(res.data.systemMessageUnReadTotal)+Number(res.data.foundPersonMessageUnReadTotal)
					}
				})
			},
			clickLeft(){
				uni.navigateBack({
					delta:1
				})
			},
			clickRight(){
				if(!uni.getStorageSync('token')){
					navigateLoginPage()
					return
				}
				if(this.rightIcon){
					uni.navigateTo({
						url:this.rightUrl
					})
				}
			},
			navTabClick(item){
				this.$emit('navTabClick',item)
			}
		}
	}
</script>

<style lang="scss" scoped>
.rightNav{
	position: relative;
	padding: 0 10rpx 0 0;
	.dot{
		position: absolute;
		width: 30rpx;
		height: 30rpx;
		border-radius: 50%;
		// background: $colorred;
		right:0;
		top:-10rpx;
		text-align: center;
		color: #fff;
		line-height: 30rpx;
	}
}
.navTab{
	margin:0 auto;
	&>view{
		margin: 0 20rpx;
		position: relative;
	}
	.activeNavTab::after{
		content: '';
		display:block;
		position:absolute;
		height: 8rpx;
		width: 100%;
		left:0;
		bottom: -10rpx;
		background:$colorMain;
		border-radius: 20rpx;
		box-shadow: 0 6rpx 10rpx rgba(0, 0, 0, .15);
	}
}
</style>